<template>
    <div>
        <h3>机构修改</h3>
        
        <table class="table table-bordered">
            <tbdoy>
                <tr>
                    <td>机构名称</td>
                    <td>
                        <input type="text" v-model="tian.jgname">
                    </td>
                </tr>
                <tr>
                    <td>机构封面</td>
                    <td>
                        <input type="file" @change="img">
                        <img :src="tian.tu" width="100" height="100" alt="" v-if="tian.tu !=''">
                    </td>
                </tr>
                <tr>
                    <td>特色服务</td>
                    <td>
                        <select v-model="tian.xiala">
                            <option value="">请选择</option>
                            <option :value="item.id" v-for="item in data.list" >{{ item.name }}</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td>营业时间</td>
                    <td>
                        <input type="date" v-model="tian.yingye">
                    </td>
                </tr>
                <tr>
                    <td>机构地址</td>
                    <td>
                        <input type="text" v-model="tian.dizhi">
                    </td>
                </tr>
                <tr>
                    <td>联系电话</td>
                    <td>
                        <input type="text" v-model="tian.phone">
                    </td>
                </tr>
                <tr>
                    <td>发布状态</td>
                    <td>
                        <input type="radio" :value="1" name="test" v-model="tian.steat">已发布
                        <input type="radio" :value="0" name="test" v-model="tian.steat">未发布
                    </td>
                </tr>
                <tr>
                    <td>发布详情</td>
                    <td>
                        <textarea v-model="tian.xiangq"></textarea>
                    </td>
                </tr>
                <tr>
                    <td></td>
                    <td>
                        <input type="button" value="修改" class="btn btn-primary" @click="ok">
                    </td>
                </tr>
            </tbdoy>
        </table>
    </div>
</template>

<script setup lang="ts">
import axios from 'axios';
import {ref,reactive, onMounted} from 'vue'
import {useRoute,useRouter} from 'vue-router'
const route=useRoute();
const router=useRouter();
let tian=reactive({
    id:route.query.id,
    jgname: '',
    tu: '',
    xiala:'',
    yingye: '',
    dizhi: '',
    phone: '',
    steat: [],
    xiangq: '',
 
})
const img=(e:any)=>{
    let obj=e.target.files[0];
    let f=new FormData();
    f.append('file',obj);
    axios({
        url:'/api/img/tu',
        method:'post',
        data:f
    })
    .then((res)=>{
        console.log(res);
        tian.tu=res.data;
    })
    .catch((err)=>{
        console.log(err);
    })
}
const data:any=reactive({
    list:[]

})
onMounted(()=>{
    getlist();
    fantian();
})
const fantian=()=>{
    axios({
        url:'/api/jg/fantian',
        method:'get',
        params:{
            id:route.query.id
        }
    })
    .then((res)=>{
        console.log(res);
        tian.jgname=res.data.jgname
        tian.tu=res.data.tu
        tian.xiala=res.data.xiala
        tian.yingye=res.data.yingye
        tian.dizhi=res.data.dizhi
        tian.phone=res.data.phone
        tian.steat=res.data.steat
        tian.xiangq=res.data.xiangq
  
    })
    .catch((err)=>{
        console.log(err);
    })
}
const getlist=()=>{
    axios({
        url:'/api/jg/shosw',
        method:'get',
    })
    .then((res)=>{
        console.log(res);
        data.list=res.data;
    })
    .catch((err)=>{
        console.log(err);
    })
}
const ok=()=>{
    axios({
        url:'/api/jg/xiugai',
        method:'put',
        data:tian
    })
    .then((res)=>{
        console.log(res);
        if(res.data>0)
    {
        alert('修改成功');
        router.push('/Jshow')
    }
    else
    {
        alert('修改失败');
    }
    })
    .catch((err)=>{
        console.log(err);
    })
}
</script>

<style scoped>

</style>